<template>
    <div class="to-do-meeting">
<!--        <el-row class="header">-->
<!--            <el-col :span="5">-->
<!--                <el-row>-->
<!--                    <el-col :span="3">-->
<!--                        <img src="../../../../assets/img/咖啡杯.svg" alt="" style="width: 20px">-->
<!--                    </el-col>-->
<!--                    <el-col :span="21">参会流程待办列表</el-col>-->
<!--                </el-row>-->
<!--            </el-col>-->
<!--        </el-row>-->
<!--        <el-main>-->
            <el-table :data="toDoMeetingList" stripe ref="toDoMeetingListRef" :header-row-style="{'background':'red'}">
                <el-table-column prop="host" label="会议创建人"/>
                <el-table-column prop="topic" label="主题"/>
                <el-table-column prop="place" label="会议地点"/>
                <el-table-column prop="startTime" label="开始时间" width="150px"/>
                <el-table-column prop="endTime" label="结束时间" width="150px"/>
                <el-table-column prop="taskName" label="任务名称"/>
<!--                <el-table-column prop="processInstanceId" label="流程实例编号"/>-->
<!--                <el-table-column prop="taskId" label="任务编号"/>-->
<!--                show-overflow-tooltip-->
                <el-table-column label="操作">
                    <template #default="s">
                        <el-button size="small" @click="meetingSignIn(s.row)" color="rgb(228,228,224)">处理</el-button>
                    </template>
                </el-table-column>
            </el-table>
<!--        </el-main>-->
    </div>
</template>

<script>
import {completeSignIn, queryPersonMeeting} from "../../../../network/adm/meeting";
import {ElMessage} from "element-plus";

export default {
    name: "ToDoMeeting",
    data(){
        return {
            toDoMeetingList: []
        }
    },
    methods:{
        checkMeetingStatus(row){
            // console.log('startTime',row)
            let {startTime,endTime} = row;
            return this.$utils.timeRange({
                startTime,
                endTime
            })
        },
        meetingSignIn(meeting){
            let {startTime,endTime,taskId} = meeting;
            this.$utils.timeRange({
                startTime,
                endTime,
                beforeFn: ()=>{
                    ElMessage.info('会议还未开始，还不能签到！');
                },
                afterFn: ()=>{
                    ElMessage.info('会议已经结束了');
                },
                betweenFn: ()=>{
                    completeSignIn(taskId).then(vo=>{
                        this.$response.handle({
                            data: vo,
                            success: '签到成功',
                            error: '签到失败',
                            successFn: ()=>{
                                this.refreshData();
                            },
                            log: '签到结果'
                        })
                    })
                }
            })
        },
        refreshData(hint){
            this.loadToDoMeetingList(hint);
        },
        loadToDoMeetingList(hint){
            queryPersonMeeting().then(vo=>{
                this.$response.handle({
                    data: vo,
                    successFn:()=>{
                        this.toDoMeetingList = vo.data;
                        if(hint){
                            ElMessage.success('刷新成功!');
                        }
                    },
                    log:'个人待办会议信息'
                })
            })
        },
    },
    created() {
        this.loadToDoMeetingList();
    }
}
</script>

<style scoped>
*{
    /*border: 1px solid red;*/
}
.to-do-meeting{

}
.header{
    padding: 0 20px;background: rgb(228,228,228);
    font-size: 14px;
    color: #666666;
}
.el-main{
    padding: 20px 20px;
    background: rgb(251,251,240);
}
.table-header-class{
    background: green;
}
</style>
